<script setup lang="ts">


</script>

<template>
    <div class="wrapper">
        <div class="item">
            <h3 class="title font-lg font-bold">
                中国汽车改装用品协会简介
            </h3>
            <ul class="car-list flex flex-wrap justify-between">
                <li class="car-item">
                    <div class="car-item-img">
                        <img src="https://img.cctvch.cn/uploads/451f5d225ae98f78ebdc80dbd7692d33.png" alt="">
                    </div>
                    <p class="car-item-text font font-normal">
                    在习近平新时代中国特色社会主义思想的指导下，中国迎来飞速发展的新时代，伴随各领域科技的发展，5G、物联网、人工智能、AR/VR、元宇宙等新兴技术手段涌现，汽车改装用品行业也出现了前所未有的机遇。
                    </p>
                </li>
                <li class="car-item">
                    <div class="car-item-img">
                        <img src="https://img.cctvch.cn/uploads/d1ace963660bcc15e19796ea778159d1.png" alt="">
                    </div>
                    <p class="car-item-text font font-normal">
                    中国汽车改装用品协会，于2014年6月成立，以商务部为业务主管部门，民政部合法注册、中央国家机关工委领导下的国家一级协会，从事汽车改装相关产品的生产、贸易和服务的企事业单位和团体，在平等自愿的基础上依法联合成立的全国性、自律性、非营利性、具有独立法人资格的社会团体。
                    </p>
                </li>
                <li class="car-item">
                    <div class="car-item-img">
                        <img src="https://img.cctvch.cn/uploads/3d867b72bfb1d57217ad42660d97eb17.png" alt="">
                    </div>
                    <p class="car-item-text font font-normal">
                    协会将始终坚持服务于会员企业的指导思想，贯彻落实国家关于汽车改装用品的法律法规，协助政府部门完善汽车改装用品从业范围，参与相关标准的研究制定；提供汽车改装用品市场发展现状、法律法规、行业趋势、领先技术等咨询服务；制定并监督执行行规行约，规范行业行为，协调同行价格争议，维护公平竞争。
                    </p>
                </li>
                <li class="car-item">
                    <div class="car-item-img">
                        <img src="https://img.cctvch.cn/uploads/be8fc47ea0a07886fedef6e5d2dbfcfc.png" alt="">
                    </div>
                    <p class="car-item-text font font-normal">
                    为了更好的加深中国改装车用品行业的影响力，服务协会分支机构及会员单位，服务社会相关行业企业，形成系统性的宣发机制，特此成立中国汽车改装用品协会新闻传媒委员会（以下简称委员会）。
                    </p>
                </li>
            </ul>
        </div>
        <div class="item">
            <h3 class="title font-lg font-bold">
                新闻传媒委员会
            </h3>
            <div class="news-box flex justify-between">
                <div class="news-left">
                    <div class="news-item">
                        <h5 class="news-title text-ellipsis font-m font-bold color-title">
                            <span>组织架构</span>
                        </h5>
                        <ul class="list">
                            <li class="list-item font font-normal">
                                <span>会长</span>：岑传理
                            </li>
                            <li class="list-item font font-normal">
                                <span>执行会长</span>：赵京辉 
                            </li>
                            <li class="list-item font font-normal">
                                <span>副会长</span>：曾  莉、都  城、金昊楠、孟宪明 
                            </li>
                            <li class="list-item font font-normal">
                                <span>秘书长</span>：贲兴洋
                            </li>
                        </ul>
                    </div>
                    <div class="news-item">
                        <h5 class="news-title text-ellipsis font-m font-bold color-title">
                            <span>部门设立</span>
                        </h5>
                        <div class="list-column">
                            <ul class="list">
                                <li class="list-item font font-normal">
                                    办公室（会员部）
                                </li>
                                <li class="list-item font font-normal">
                                    编辑部
                                </li>
                                <li class="list-item font font-normal">
                                    广告部
                                </li>
                            </ul>
                            <ul class="list">
                                <li class="list-item font font-normal">
                                新闻媒体部
                                </li>
                                <li class="list-item font font-normal">
                                市场开发部
                                </li>
                                <li class="list-item font font-normal">
                                对外合作部
                                </li>
                            </ul>
                           
                        </div>
                    </div>
                </div>
                <div class="news-right">
                    <h5 class="news-title text-ellipsis font-m font-bold color-title">
                        <span>会员单位</span>
                    </h5>
                    <div class="clomn-list flex justify-between">
                        <ul class="list">
                            <li class="list-item font font-normal">
                            中央广电总台《擎动中国》
                            </li>
                            <li class="list-item font font-normal">
                            国家体育总局《华奥星空》
                            </li>
                            <li class="list-item font font-normal">
                            《中国体育报》
                            </li>
                            <li class="list-item font font-normal">
                            《车王》杂志
                            </li>
                            <li class="list-item font font-normal">
                            搜狐网
                            </li>
                            <li class="list-item font font-normal">
                            人民网
                            </li>
                            <li class="list-item font font-normal">
                            新华网
                            </li>
                            <li class="list-item font font-normal">
                            腾讯网
                            </li>
                            <li class="list-item font font-normal">
                            央视频
                            </li>
                            <li class="list-item font font-normal">
                            百度
                            </li>
                            <li class="list-item font font-normal">
                            《极速汽车》频道（歌华144）
                            </li>
                        </ul>
                        <ul class="list">
                            <li class="list-item font font-normal">
                            中国报道
                            </li>
                            <li class="list-item font font-normal">
                            科技日报 
                            </li>
                            <li class="list-item font font-normal">
                            中国贸易报
                            </li>
                            <li class="list-item font font-normal">
                            中国商报
                            </li>
                            <li class="list-item font font-normal">
                            欧洲华语广播
                            </li>
                            <li class="list-item font font-normal">
                            腾讯视频
                            </li>
                            <li class="list-item font font-normal">
                            新浪汽车
                            </li>
                            <li class="list-item font font-normal">
                            每日赛车App
                            </li>
                            <li class="list-item font font-normal">
                            汽车之家
                            </li>
                            <li class="list-item font font-normal">
                            懂车帝
                            </li>
                        </ul>
                        <ul class="list">
                            <li class="list-item font font-normal">
                            网易汽车
                            </li>
                            <li class="list-item font font-normal">
                            凤凰汽车
                            </li>
                            <li class="list-item font font-normal">
                            易车网
                            </li>
                            <li class="list-item font font-normal">
                            PP体育
                            </li>
                            <li class="list-item font font-normal">
                            搜狐新闻
                            </li>
                            <li class="list-item font font-normal">
                            虎扑
                            </li>
                            <li class="list-item font font-normal">
                            中国经济报道
                            </li>
                            <li class="list-item font font-normal">
                            中国经济新闻联播
                            </li>
                            <li class="list-item font font-normal">
                            千龙网
                            </li>
                            <li class="list-item font font-normal">
                            中国网
                            </li>
                            <li class="list-item font font-normal">
                            北青网
                            </li>
                        </ul>
                        <ul class="list">
                            <li class="list-item font font-normal">
                            凤凰网
                            </li>
                            <li class="list-item font font-normal">
                            《中华英才》
                            </li>
                            <li class="list-item font font-normal">
                            北京日报网
                            </li>
                            <li class="list-item font font-normal">
                            京城社区通
                            </li>
                            <li class="list-item font font-normal">
                            爱卡汽车
                            </li>
                            <li class="list-item font font-normal">
                            太平洋汽车
                            </li>
                            <li class="list-item font font-normal">
                            腾讯汽车
                            </li>
                            <li class="list-item font font-normal">
                            汽车观察
                            </li>
                            <li class="list-item font font-normal">
                            汽车人
                            </li>
                            <li class="list-item font font-normal">
                            极驾客
                            </li>
                            <li class="list-item font font-normal">
                            先锋汽车
                            </li>

                        </ul>
                        <ul class="list">
                            <li class="list-item font font-normal">
                            网通社
                            </li>
                            <li class="list-item font font-normal">
                            汽车商业评论
                            </li>
                            <li class="list-item font font-normal">
                            汽车品评
                            </li>
                            <li class="list-item font font-normal">
                            天天汽车
                            </li>
                            <li class="list-item font font-normal">
                            大众侃车
                            </li>
                            <li class="list-item font font-normal">
                            玩车教授
                            </li>
                            <li class="list-item font font-normal">
                            车友头条
                            </li>
                            <li class="list-item font font-normal">
                            1号车盟
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<style lang="scss" scoped>
.item {
    .title {
        margin-top: 53px;
        margin-bottom: 34px;
    }

    .color-title {
        span {
            background-image: linear-gradient(to right, #252086 0%, #e60012 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }
    }

    // 汽车改装
    .car-list {
        .car-item {
            // margin-right: 20px;
            width: 340px;

            &::nth-child(4) {
                margin-right: 0;
            }

            .car-item-img {
                width: 340px;
                height: 190px;
                border-radius: 12px;
                overflow: hidden;
                box-shadow: 0px 5px 26px 3px rgba(98, 102, 117, 0.1500);

                img {
                    display: block;
                    width: 100%;
                    height: 100%;
                }
            }

            .car-item-text {
                margin-top: 35px;
                line-height: 22px;
            }
        }
    }

    // 新闻传媒
    .news-box {
        .news-lfet {
            width: 287px;
        }

        .news-right {
            width: 1014px;
        }
    }

    .news-title {
        margin-bottom: 20px;
    }

    .list {
        margin-bottom: 46px;

        .list-item {
            line-height: 22px;
            color: #626675;

            span {
                display: inline-block;
                width: 60px;
                text-align: justify;
                text-justify: distribute-all-lines; // 这行必加，兼容ie浏览器
                text-align-last: justify;
            }

            &::before {
                content: "";
                margin-top: -2px;
                margin-right: 6px;
                display: inline-block;
                width: 6px;
                height: 6px;
                background: #626675;
                border-radius: 50%;
                vertical-align: middle;
            }
        }
    }

    .list-column {
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 90px;

        .list {
            margin-bottom: 0;
            margin-right: 40px;
        }
    }
}
</style>